<template>
  <div id="article-list-right">
    <tag-cloud @searchWithTag="searchWithTag()" />
    <advertisement/>
    <article-rank :ranks="hotArticles" title="热门文章" title-size="24" />
  </div>
</template>

<script>
import TagCloud from "./TagCloud";
import Advertisement from "./Advertisement";
import ArticleRank from "./ArticleRank";

import {ranks} from "../../data/ranks";
export default {
  name: "ArticleListRight",
  components:{TagCloud,Advertisement,ArticleRank},
  props:{
    hotArticles: {
      type:Array,
      default: ranks
    }
  },
  data(){
    return {
    }
  },
  methods:{
    searchWithTag(){
      this.$emit("searchWithTag")
    }
  }
}
</script>

<style scoped>
#article-list-right{
  padding-left:20px;
  box-sizing: border-box;
}
</style>
